﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>族谱网 - 首页</title>

    <link href="${ctx}/assets/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="${ctx}/assets/jquery/jquery2.2.4.min.js"></script>
    <script src="${ctx}/assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

    <link href="${ctx}/assets/fs002/fs_0.2.css" rel="stylesheet">
    <link href="${ctx}/assets/fitness/all_fit.css" rel="stylesheet">
    <link href="${ctx}/assets/fitness/index_fit.css" rel="stylesheet">
    <style type="text/css">
.dropbtn {
	background: rgb(248, 119, 9);
	margin-left: 10px;
	color: white;
	padding: 10px 20px;
	font-size: 16px;
	border: none;
	cursor: pointer;
	border-top: 1px solid rgb(222, 208, 33);
	border-left: 1px solid rgb(222, 208, 33);
	border-right: 1px solid rgb(222, 208, 33);
	border-radius: 4px 4px 0 0;
	margin-top: 10px;
	/*margin-left: 10px;
    color: #fff;
    background: rgb(248,119,9);
    padding: 10px 20px;
    margin-top: 10px;
    border-top: 1px solid rgb(222,208,33);
    border-left: 1px solid rgb(222,208,33);
    border-right: 1px solid rgb(222,208,33);
    border-radius: 4px 4px 0 0;*/
}

.dropbtn:hover, .dropbtn:focus {
	background-color: rgb(268, 139, 9);
}

.dropdown {
	position: relative;
	display: inline-block;
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	overflow: auto;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

.dropdown a:hover {
	background-color: #f1f1f1
}

.show {
	display: block;
}
</style>
<script type="text/javascript">
	/* 点击按钮，下拉菜单在 显示/隐藏 之间切换 */
	function myFunction() {
		document.getElementById("myDropdown").classList.toggle("show");
	}

	// 点击下拉菜单意外区域隐藏
	window.onclick = function(event) {
		if (!event.target.matches('.dropbtn')) {

			var dropdowns = document.getElementsByClassName("dropdown-content");
			var i;
			for (i = 0; i < dropdowns.length; i++) {
				var openDropdown = dropdowns[i];
				if (openDropdown.classList.contains('show')) {
					openDropdown.classList.remove('show');
				}
			}
		}
	}
</script>
</head>
<body>
<div class="container-fluid zp-topper">
    <div class="row">
        <div class="container">
            <img src="${ctx}/assets/img/logo.png">
        </div>
    </div>
</div>


<div class="navbar navbar-default">
    <div class="container">
        <a class="navbar-brand" href="#"></a>
        <div class="collapse navbar-collapse" id="topbar">
            <ul class="nav navbar-nav">
                <!-- <li class=""><a href="${ctx}/">首页</a></li> -->
                <c:if test="${not empty loginUser}">
                    <li class=""><a href="${ctx}/index">家学渊源</a></li>
                    <li class=""><a href="#">我的博客</a></li>
                    <li class=""><a href="#">保存中心</a></li>
                </c:if>
                    <!-- <li class=""><a href="${ctx}/list">百家姓</a></li>
                    <li class=""><a href="${ctx}/lyan">留言板</a></li> -->
                <!--  <li class=""><a>搜索查询</a></li> -->
            </ul>

            <ul class="nav navbar-nav navbar-right">
					<c:choose>
						<c:when test="${empty loginUser}">
							<li class=""><a href="${ctx}/sign">登陆账号</a></li>
						</c:when>
						<c:otherwise>
							<div class="dropdown">
								<button onclick="myFunction()" class="dropbtn">${loginUser.name }</button>
								<div id="myDropdown" class="dropdown-content">
									 <a href="${ctx }/logout">退出</a>
								
								</div>
							</div>
						</c:otherwise>
					</c:choose>
				</ul>
        </div>
    </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-md-8">
            <div class="panel panel-warning" style="padding-bottom: 30px;">
                <div class="panel-heading">族谱</div>
                <div class="panel-body" style="padding-left: 0px;">
                    <ul class="box01">
                        <li><a href="#" title="赵姓起源" target="">赵</a></li>
                        <li><a href="#" title="钱姓起源" target="">钱</a></li>
                        <li><a href="#" title="孙姓起源" target="">孙</a></li>
                        <li><a href="#" title="李姓起源" target="">李</a></li>
                        <li><a href="#" title="周姓起源" target="">周</a></li>
                        <li><a href="#" title="吴姓起源" target="">吴</a></li>
                        <li><a href="#" title="郑姓起源" target="">郑</a></li>
                        <li><a href="#" title="王姓起源" target="">王</a></li>
                        <li><a href="#" title="冯姓起源" target="">冯</a></li>
                        <li><a href="#" title="陈姓起源" target="">陈</a></li>
                        <li><a href="#" title="褚姓起源" target="">褚</a></li>
                        <li><a href="#" title="卫姓起源" target="">卫</a></li>
                        <li><a href="#" title="蒋姓起源" target="">蒋</a></li>
                        <li><a href="#" title="沈姓起源" target="">沈</a></li>
                        <li><a href="#" title="韩姓起源" target="">韩</a></li>
                        <li><a href="#" title="杨姓起源" target="">杨</a></li>
                        <li><a href="#" title="朱姓起源" target="">朱</a></li>
                        <li><a href="#" title="秦姓起源" target="">秦</a></li>
                        <li><a href="#" title="尤姓起源" target="">尤</a></li>
                        <li><a href="#" title="许姓起源" target="">许</a></li>
                        <li><a href="#" title="何姓起源" target="">何</a></li>
                        <li><a href="#" title="吕姓起源" target="">吕</a></li>
                        <li><a href="#" title="施姓起源" target="">施</a></li>
                        <li><a href="#" title="张姓起源" target="">张</a></li>
                        <li><a href="#" title="孔姓起源" target="">孔</a></li>
                        <li><a href="#" title="曹姓起源" target="">曹</a></li>
                        <li><a href="#" title="严姓起源" target="">严</a></li>
                        <li><a href="#" title="华姓起源" target="">华</a></li>
                        <li><a href="#" title="金姓起源" target="">金</a></li>
                        <li><a href="#" title="魏姓起源" target="">魏</a></li>
                        <li><a href="#" title="陶姓起源" target="">陶</a></li>
                        <li><a href="#" title="姜姓起源" target="">姜</a></li>
                        <li><a href="#" title="戚姓起源" target="">戚</a></li>
                        <li><a href="#" title="谢姓起源" target="">谢</a></li>
                        <li><a href="#" title="邹姓起源" target="">邹</a></li>
                        <li><a href="#" title="喻姓起源" target="">喻</a></li>
                        <li><a href="#" title="柏姓起源" target="">柏</a></li>
                        <li><a href="#" title="水姓起源" target="">水</a></li>
                        <li><a href="#" title="窦姓起源" target="">窦</a></li>
                        <li><a href="#" title="章姓起源" target="">章</a></li>
                        <li><a href="#" title="云姓起源" target="">云</a></li>
                        <li><a href="#" title="苏姓起源" target="">苏</a></li>
                        <li><a href="#" title="潘姓起源" target="">潘</a></li>
                        <li><a href="#" title="葛姓起源" target="">葛</a></li>
                        <li><a href="#" title="奚姓起源" target="">奚</a></li>
                        <li><a href="#" title="范姓起源" target="">范</a></li>
                        <li><a href="#" title="彭姓起源" target="">彭</a></li>
                        <li><a href="#" title="郎姓起源" target="">郎</a></li>
                        <li><a href="#" title="鲁姓起源" target="">鲁</a></li>
                        <li><a href="#" title="韦姓起源" target="">韦</a></li>
                        <li><a href="#" title="昌姓起源" target="">昌</a></li>
                        <li><a href="#" title="马姓起源" target="">马</a></li>
                        <li><a href="#" title="苗姓起源" target="">苗</a></li>
                        <li><a href="#" title="凤姓起源" target="">凤</a></li>
                        <li><a href="#" title="花姓起源" target="">花</a></li>
                        <li><a href="#" title="方姓起源" target="">方</a></li>
                        <li><a href="#" title="俞姓起源" target="">俞</a></li>
                        <li><a href="#" title="任姓起源" target="">任</a></li>
                        <li><a href="#" title="袁姓起源" target="">袁</a></li>
                        <li><a href="#" title="柳姓起源" target="">柳</a></li>
                        <li><a href="#" title="酆姓起源" target="">酆</a></li>
                        <li><a href="#" title="鲍姓起源" target="">鲍</a></li>
                        <li><a href="#" title="史姓起源" target="">史</a></li>
                        <li><a href="#" title="唐姓起源" target="">唐</a></li>
                        <li><a href="#" title="费姓起源" target="">费</a></li>
                        <li><a href="#" title="廉姓起源" target="">廉</a></li>
                        <li><a href="#" title="岑姓起源" target="">岑</a></li>
                        <li><a href="#" title="薛姓起源" target="">薛</a></li>
                        <li><a href="#" title="雷姓起源" target="">雷</a></li>
                        <li><a href="#" title="贺姓起源" target="">贺</a></li>
                        <li><a href="#" title="倪姓起源" target="">倪</a></li>
                        <li><a href="#" title="汤姓起源" target="">汤</a></li>
                        <li><a href="#" title="滕姓起源" target="">滕</a></li>
                        <li><a href="#" title="殷姓起源" target="">殷</a></li>
                        <li><a href="#" title="罗姓起源" target="">罗</a></li>
                        <li><a href="#" title="罗姓起源" target="">毕</a></li>
                        <li><a href="#" title="郝姓起源" target="">郝</a></li>
                        <li><a href="#" title="邬姓起源" target="">邬</a></li>
                        <li><a href="#" title="安姓起源" target="">安</a></li>
                        <li><a href="#" title="常姓起源" target="">常</a></li>
                        <li><a href="#" title="乐姓起源" target="">乐</a></li>
                        <li><a href="#" title="于姓起源" target="">于</a></li>
                        <li><a href="#" title="时姓起源" target="">时</a></li>
                        <li><a href="#" title="傅姓起源" target="">傅</a></li>
                        <li><a href="#" title="皮姓起源" target="">皮</a></li>
                        <li><a href="#" title="卞姓起源" target="">卞</a></li>
                        <li><a href="#" title="齐姓起源" target="">齐</a></li>
                        <li><a href="#" title="康姓起源" target="">康</a></li>
                        <li><a href="#" title="伍姓起源" target="">伍</a></li>
                        <li><a href="#" title="余姓起源" target="">余</a></li>
                        <li><a href="#" title="元姓起源" target="">元</a></li>
                        <li><a href="#" title="卜姓起源" target="">卜</a></li>
                        <li><a href="#" title="顾姓起源" target="">顾</a></li>
                        <li><a href="#" title="孟姓起源" target="">孟</a></li>
                        <li><a href="#" title="平姓起源" target="">平</a></li>
                        <li><a href="#" title="黄姓起源" target="">黄</a></li>
                        <li><a href="#" title="和姓起源" target="">和</a></li>
                        <li><a href="#" title="穆姓起源" target="">穆</a></li>
                        <li><a href="#" title="萧姓起源" target="">萧</a></li>
                        <li><a href="#" title="尹姓起源" target="">尹</a></li>
                    </ul>
                </div>
                <hr>
                <div class="panel-body" style="padding: 0 35px;">
                    <p>宗族资讯</p>
                    <div class="media">
                        <div class="media-left">
                            <a href="#">
                                <img class="media-object img-thumbnail" src="${ctx}/assets/img/p1.gif" alt="...">
                            </a>
                        </div>
                        <div class="media-body">
                            <h4 class="media-heading">探寻国人家谱寻宗路:20多年前家谱是一种禁忌</h4><br>
                            家谱寻宗　重建家风的坐标<br>
                            对家庭、家族的信仰，是中国人的精神特征，也是民族的文化特质
                        </div>
                    </div>
                    <div class="media">
                        <div class="media-left">
                            <a href="#">
                                <img class="media-object img-thumbnail" src="${ctx}/assets/img/p1.gif" alt="...">
                            </a>
                        </div>
                        <div class="media-body">
                            <h4 class="media-heading">探寻国人家谱寻宗路:20多年前家谱是一种禁忌</h4><br>
                            家谱寻宗　重建家风的坐标<br>
                            对家庭、家族的信仰，是中国人的精神特征，也是民族的文化特质
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="panel panel-warning">
                <div class="panel-heading">搜索</div>
                <div class="panel-body">
                    <form class="form-inline">
                        <div class="form-group">
                            <label class="sr-only" for="exampleInputAmount">Amount (in dollars)</label>
                            <div class="form-inline">

                                <input type="text" class="form-control" id="exampleInputAmount" placeholder="关键词">
                                <button type="submit" class="btn btn-warning">
                                    搜索
                                </button>
                            </div>
                        </div>
                    </form>
                    <hr/>
                    <ul class="box2">
                        <li class="r080913_03_g">精彩话题</li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">刁氏居住地名辑录</a><span class="red">(326)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">黄氏宗亲社区签到处</a><span class="red">(310)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[黄姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">迁湘二世祖墓碑</a><span class="red">(14)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[官姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">刁包文章选译</a><span class="red">(5)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">刁包列传</a><span class="red">(2)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">刁山泉先生小传/刘学海</a><span class="red">(0)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">重修太中山碑记</a><span class="red">(0)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">戴烈女传 /[清]  刁显祖</a><span class="red">(0)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[刁姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">我宋氏族辈份字</a><span class="red">(163)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[宋姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">李氏字辈谱100例(一)</a><span class="red">(134)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[李姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">谭氏家族建议</a><span class="red">(197)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[谭姓社区]</span></li>
                        <li class="r080913_03_h"><span style="color:#999;"></span><a href="#" target="" class="a_pc06">我是党玉柱，欢迎登陆党姓族谱录党玉柱的个人主页</a><span class="red">(246)</span><span style="font-size:12px;color:#999;">&nbsp;&nbsp;[党姓社区]</span></li>

                    </ul>

                </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid" style="background: #fff;padding-top: 10px;">
    <div class="container">
        <div id="footer" style="margin-bottom:20px;">
            <ul id="copyright" style="margin-left:0px;line-height:130%;">

            <div style="width:300px;margin:0 auto; padding:20px 0;">
                <a target="_blank" # style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"><p style="float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#939393;">粤公网安备 43018102000107号</p></a>
            </div>
        </div>
    </div>
</div>

</body>
</html>